<!--#
layout("/layouts/platform.html"){
#-->
<div id="app"  v-cloak>
<!--
    <div class="head"><div class="headone"><i class="el-icon-menu"></i><span >样品信息</span></div></div>
-->
    <el-row class="header navbar bg-white">
        <div class="btn-group tool-button" style="line-height: 50px;">
            样品编号或名称：<el-input clearable placeholder="样品编号或名称" v-trim v-model="pageForm.searchKeyword"  size="mini" style="width:180px;"></el-input>
            检验状态：<el-select v-trim v-model="pageForm.lczt" placeholder="检验状态" size="mini" style="width:180px;" clearable>
                <el-option v-for="item in allMap.lcztOptions" :key="item.value" :label="item.label" :value="item.value">
                </el-option>
            </el-select>
            流转状态：<el-select v-trim v-model="pageForm.lzzt" placeholder="流转状态" size="mini" style="width:180px;" clearable>
                <el-option v-for="item in allMap.lzztOptions" :key="item.value" :label="item.label" :value="item.value">
                </el-option>
            </el-select>
            信息状态：<el-select v-trim v-model="pageForm.delflag" placeholder="信息状态" size="mini" style="width:180px;" clearable>
                <el-option label="正常" value="0"></el-option>
                <el-option label="已删除" value="1"></el-option>
            </el-select>
            <el-button slot="append" icon="el-icon-search" size="mini" @click="doSearch" circle></el-button>
        </div>
    </el-row>
    <el-row class="el-table-container">
        <el-table :data="tableData" @sort-change='pageOrder' height="520"  border size="small" header-align="center" row-key="id"  style="width: 100%" @selection-change="handleSelectionChange">
            <el-table-column fixed="left" prop="userOnline" label="操作" width="120" header-align="center" align="center">
                <template slot-scope="scope">
                    <el-dropdown @command="dropdownCommand">
                        <el-button size="mini"><i class="ti-settings"></i><span class="ti-angle-down"></span></el-button>
                        <el-dropdown-menu slot="dropdown">
                            <template>
                                <!--#if(@shiro.hasPermission("bus.ypxx.jbxxAdmin.edit")){#-->
                                    <el-dropdown-item :command="{type:'edit',id:scope.row.id}">修改</el-dropdown-item>
                                <!--#}#-->
                                <!--#if(@shiro.hasPermission("bus.ypxx.jbxxAdmin.delete")){#-->
                                    <el-dropdown-item v-if="scope.row.delflag==0"  :command="{type:'delete',id:scope.row.id,ypbh:scope.row.ypbh}">删除</el-dropdown-item>
                                <!--#}#-->
                                <!--#if(@shiro.hasPermission("bus.ypxx.jbxxAdmin.restore")){#-->
                                <el-dropdown-item  v-if="scope.row.delflag==1" :command="{type:'restore',id:scope.row.id,ypbh:scope.row.ypbh}">恢复</el-dropdown-item>
                                <!--#}#-->
                                <el-dropdown-item  :command="{type:'detail',id:scope.row.id}">详情</el-dropdown-item>
                            </template>
                        </el-dropdown-menu>
                    </el-dropdown>
                </template>
            </el-table-column>
            <el-table-column fixed="left" sortable="custom" prop="ypbh" label="样品编号" width="150px;" header-align="center"  show-overflow-tooltip></el-table-column>
            <el-table-column fixed="left" sortable="custom" prop="bgbh" label="报告编号" width="150px;" header-align="center"  show-overflow-tooltip></el-table-column>
            <el-table-column sortable="custom" prop="username" label="登记人" width="120px;" header-align="center"  show-overflow-tooltip></el-table-column>
            <el-table-column prop="lczt" label="检验状态" width="100px;" header-align="center"  show-overflow-tooltip>
                <template slot-scope="scope" ><span :class="'statusCss-'+scope.row.lczt"><i :class="'el-icon-'+scope.row.lczt"/>{{getDict(scope.row.lczt,allMap.lcztMap)}}</span></template>
            </el-table-column>
            <el-table-column prop="delflag" label="信息状态" width="100px;" header-align="center"  show-overflow-tooltip>
                <template slot-scope="scope" >
                    <span v-if="scope.row.delflag=='0'">正常</span>
                    <span v-if="scope.row.delflag=='1'">已删除</span>
                </template>
            </el-table-column>
            <el-table-column prop="lzzt" label="流转状态" width="150px;" header-align="center"  show-overflow-tooltip>
                <template slot-scope="scope" >
                    <span :class="'lzstatusCss-'+scope.row.lzzt"><i :class="'lzel-icon-'+scope.row.lzzt"/>{{getDict(scope.row.lzzt,allMap.lzztMap)}}
                </span>
                    <span v-if="scope.row.lzzt<3"><span v-if="scope.row.status=='0'">(待接收)</span>
                    <span v-if="scope.row.status=='1'">(已接收)</span>
                    <span v-if="scope.row.status=='-1'">(已拒收)</span></span></template>
            </el-table-column>
            <el-table-column sortable="custom"  prop="ypmc" label="产品名称" width="150px;" header-align="center"  show-overflow-tooltip></el-table-column>
            <el-table-column sortable="custom" prop="jylx" label="检验类别" width="100px;" header-align="center" align="center" show-overflow-tooltip>
                <template slot-scope="scope" >{{getDict(scope.row.jylx,allMap.jylxMap)}}</template>
            </el-table-column>
            <el-table-column sortable="custom" prop="jyks" label="检验部门" width="100px;" header-align="center" align="center" show-overflow-tooltip></el-table-column>
            <el-table-column prop="wtdw" label="委托单位" width="100px;" header-align="center" align="center" show-overflow-tooltip></el-table-column>
            <el-table-column prop="ggxh" label="规格型号" width="100px;" header-align="center" align="center" show-overflow-tooltip></el-table-column>
            <el-table-column prop="scrqpc" label="生产日期/批号" width="120px;" header-align="center" align="center" show-overflow-tooltip></el-table-column>
            <el-table-column prop="sb" label="商标" width="100px;" header-align="center" align="center" show-overflow-tooltip></el-table-column>
            <el-table-column sortable="custom" prop="wcqx" label="完成期限" width="100px;" header-align="center" align="center" show-overflow-tooltip></el-table-column>
        </el-table>
    </el-row>
    <el-row class="el-pagination-container">
        <el-pagination @size-change="pageSizeChange" @current-change="pageNumberChange" :current-page="pageForm.pageNumber" :page-sizes="[10, 20, 30, 50]"
                       :page-size="pageForm.pageSize" layout="total, sizes, prev, pager, next, jumper" :total="pageForm.totalCount">
        </el-pagination>
    </el-row>
    <el-drawer   title="详情" :visible.sync="drawer" direction="rtl" size="80%" @opened="openIframe" destroy-on-close>
        <iframe id="iframeDetail"  src="" width="100%" height="100%" frameborder="0" marginheight="0" ></iframe>
    </el-drawer>
</div>
<script>
    new Vue({
        el: "#app",
        data: function () {
            var allMap = {jylxMap:${jylxMap},lcztMap:${lcztMap},lzztMap:${lzztMap},lcztOptions:${lcztOptions},lzztOptions:${lzztOptions}};
            return {
                allMap:allMap,
                tableData: [],
                menuOptions: [],
                pageForm: {delflag:'0'},
                multipleSelection: [],
                drawer: false,
                deltailURL:"",
                userId:"${userId}"
            }
        },
        methods: {
            pageOrder: function (column) {//按字段排序
                this.pageForm.pageOrderName = column.prop;
                this.pageForm.pageOrderBy = column.order;
                this.pageData();
            },
            pageNumberChange: function (val) {//页码更新操作
                this.pageForm.pageNumber = val;
                this.pageData();
            },
            pageSizeChange: function (val) {//分页大小更新操作
                this.pageForm.pageSize = val;
                this.pageData();
            },
            pageData: function () {//加载分页数据
                var self = this;
                sublime.showLoadingbar();//显示loading
                $.post(base + "/platform/bus/ypxx/jbxxAdmin/data", self.pageForm, function (data) {
                    sublime.closeLoadingbar();//关闭loading
                    if (data.code == 0) {
                        self.tableData = data.data.list;
                        self.pageForm.totalCount = data.data.totalCount;
                    } else {
                        self.$message({
                            message: data.msg,
                            type: 'error'
                        });
                    }
                }, "json");
            },
            doSearch: function () {
                this.pageForm.pageNumber = 1;
                this.pageData();
            },
            getDict: function (val,map) {
                val = val + "";
                if (val!= null && val!=undefined &&val!="" &&val!="null" &&val!="undefined"  && map!=null && map !=undefined){
                    var str = val.split(",");
                    var strname="";
                    for (var a=0;a<str.length;a++){
                        strname+=map[str[a]];
                        if(strname == null){
                            alert(1)
                        }
                        if(a<(str.length-1)){
                            strname+="/";
                        }
                    }
                    return strname;
                }
                return "";
            },
            dropdownCommand: function (command) {//监听下拉框事件
                var self = this;
                if ("edit" == command.type) {
                    window.location.href="/platform/bus/ypxx/jbxxAdmin/edit/"+command.id+"?pageForm="+JSON.stringify(this.pageForm);
                }
                if ("detail" == command.type) {
                    this.drawer=true;
                    this.deltailURL="/platform/bus/ypxx/jbxx/detail/"+command.id;
                }
                if ("delete" == command.type) {
                    self.$confirm('此操作将删除 ' + command.ypbh, '提示', {
                        confirmButtonText: '确定',
                        cancelButtonText: '取消',
                        type: 'warning',
                        callback: function (a, b) {
                            if ("confirm" == a) {//确认后再执行
                                sublime.showLoadingbar();//显示loading
                                $.post(base + "/platform/bus/ypxx/jbxxAdmin/delete/" + command.id, {}, function (data) {
                                    sublime.closeLoadingbar();//关闭loading
                                    if (data.code == 0) {
                                        self.$message({
                                            message: data.msg,
                                            type: 'success'
                                        });
                                        self.doSearch();
                                    } else {
                                        self.$message({
                                            message: data.msg,
                                            type: 'error'
                                        });
                                    }
                                }, "json");
                            }
                        }
                    });
                }
                if ("restore" == command.type) {
                    self.$confirm('此操作将恢复 ' + command.ypbh, '提示', {
                        confirmButtonText: '确定',
                        cancelButtonText: '取消',
                        type: 'warning',
                        callback: function (a, b) {
                            if ("confirm" == a) {//确认后再执行
                                sublime.showLoadingbar();//显示loading
                                $.post(base + "/platform/bus/ypxx/jbxxAdmin/restore/" + command.id, {}, function (data) {
                                    sublime.closeLoadingbar();//关闭loading
                                    if (data.code == 0) {
                                        self.$message({
                                            message: data.msg,
                                            type: 'success'
                                        });
                                        self.doSearch();
                                    } else {
                                        self.$message({
                                            message: data.msg,
                                            type: 'error'
                                        });
                                    }
                                }, "json");
                            }
                        }
                    });
                }
            },
            openIframe:function(){
                $("#iframeDetail").attr("src",this.deltailURL);
            },
            handleClose: function() {
                this.drawer=false;
            },
            handleSelectionChange: function (val) {
                this.multipleSelection = val;
            }
        },
        created: function () {
            var pagef = `${pageForm}`
            if(nONull(pagef)){
                this.pageForm = JSON.parse(pagef);
            }
            this.doSearch();
        }
    });

    function nONull(val){
        if (val!= null && val!=undefined &&val!="" &&val!="null" &&val!="undefined" ){
            return true;
        }else{
            return false;
        }
    }
</script>
<!--#
}
#-->
